{% load staticfiles %}
<div class="modal fade" id="new_post_modal" role="dialog">
    <div class="modal-dialog" style="width:750px;">
        <div class="modal-content">
            <div class="modal-header">
                <a href="#" class="btn btn-success pull-right" data-dismiss="modal">×</a>
                <h4>New Post</h4>
            </div>
            <div class="modal-body">
                <form>
                {% for field in form %}
                    <div class="row">
                        <div class="form-group">
                            <div class="fieldWrapper">
                                <label class="col-sm-3 control-label">
                                    {{ field.label }}
                                </label>
                                <div class="col-sm-9">
                                    {{ field }}
                                </div>
                            </div>
                        </div>
                    </div>
                    <br/>
                {% endfor %}
                </form>

                <!-- Error Message Box -->
                <div id="error_box" name="error_box" class="alert alert-danger alert-dismissable" hidden="true">
                    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
                    ERROR: This is to be filled in by the "print_error" function. If you see this message that means there's an error with your javascript somewhere.
                </div><!-- /.Error Message Box -->
            </div>
            <div class="modal-footer">
                <button onclick="ajax_insert_post({{ thread.thread_id }});"
                             id="submit_post_btn"
                           name="submit_post_btn"
                           type="button"
                          class="btn btn-primary">
                    <i class="fa fa-plus"></i> Submit
                </button>
            </div>
        </div>
    </div>
</div>
<script>
    $(document).ready(function(){
        // When this model hides, we will clear the contents of it.
        $('#new_post_modal').on('hidden.bs.modal', function (e) {
            // Clear all the code inside this modal.
            $('#new_post_modal').html('');
            $('#reply_' + {{ thread.thread_id }} + '_btn').prop("disabled", false); // Unlock button
        })
    });
</script>
